{% extends 'users/user-base.html' %}

{% load static %}
{% block title %}控制台{% endblock %}
{% block custom_css %}
    <style>
        td{
            vertical-align:middle !important;
        }
    </style>
{% endblock %}

{% block custom_js %}{% endblock %}

{% block content %}

    <div class="down-main">
        <div class="left-main left-full">
            <div class="sidebar-fold"><span class="glyphicon glyphicon-menu-hamburger"></span></div>
            <div class="subNavBox">
                <div class="sBox">
                    <div class="subNav sublist-down"><span
                            class="title-icon glyphicon glyphicon-chevron-down"></span><span class="sublist-title">云计算基础服务</span>
                    </div>
                    <ul class="navContent" style="display:block">
                        <li >
                            <div class="showtitle" style="width:100px;">我的云主机</div>

                            <a href="{% url 'users:usercontrol' %}"><span
                                    class="sublist-icon glyphicon glyphicon-cloud"></span><span
                                    class="sub-title">我的云主机</span></a>
                        </li>
<!--                         <li >-->
<!--                            <div class="showtitle" style="width:100px;">我的备份</div>-->

<!--                            <a href="{% url 'users:snapshotlist' %}"><span-->
<!--                                    class="sublist-icon glyphicon glyphicon-cloud"></span><span-->
<!--                                    class="sub-title">我的备份</span></a>-->
<!--                        </li>-->
                        <li >
                            <div class="showtitle" style="width:100px;">我的容器</div>

                            <a href="{% url 'users:container_list' %}"><span
                                    class="sublist-icon glyphicon glyphicon-cloud"></span><span
                                    class="sub-title">我的容器</span></a>
                        </li>
                        <li >
                            <div class="showtitle" style="width:100px;">虚拟机申请记录</div>

                            <a href="{% url 'users:vmcheck' %}"><span
                                    class="sublist-icon glyphicon glyphicon-cloud"></span><span
                                    class="sub-title">虚拟机申请记录</span></a>
                        </li>
<!--                         <li >-->
<!--                            <div class="showtitle" style="width:100px;">端口申请记录</div>-->

<!--                            <a href="{% url 'users:portRecords' %}"><span-->
<!--                                    class="sublist-icon glyphicon glyphicon-check"></span><span-->
<!--                                    class="sub-title">端口申请记录</span></a>-->
<!--                        </li>-->
                        <li >
                            <div class="showtitle" style="width:100px;">配置申请记录</div>

                            <a href="{% url 'users:configurationRecords' %}"><span
                                    class="sublist-icon glyphicon glyphicon-check"></span><span
                                    class="sub-title">配置申请记录</span></a>
                        </li>
                    </ul>
                </div>

            </div>
        </div>

        <div class="dashboard-wrapper">
            <div class="dashboard-ecommerce">
                <div class="container-fluid dashboard-content ">
                    <!-- ============================================================== -->
                    <!-- pageheader  -->
                    <!-- ============================================================== -->
                    <div class="row">
                        <div class="col-xl-12 col-lg-12 col-md-12 col-sm-12 col-12">
                            <div class="page-header">
                                <h2 class="pageheader-title">端口申请记录</h2>
                                <div class="page-breadcrumb">
                                    <nav aria-label="breadcrumb">
                                        <ol class="breadcrumb">
                                            <li class="breadcrumb-item">云计算基础服务</a></li>
                                            <li class="breadcrumb-item active" aria-current="page">端口申请记录</li>
                                        </ol>
                                    </nav>
                                </div>
                            </div>
                        </div>
                    </div>
                    <!-- ============================================================== -->
                    <!-- end pageheader  -->
                    <!-- ============================================================== -->

                    <div class="row">
                        <!-- ============================================================== -->
                        <!-- basic table  -->
                        <!-- ============================================================== -->
                        <div class="col-xl-12 col-lg-12 col-md-12 col-sm-12 col-12">
                            <div class="card">
                                <div class="card-body">
                                    <div class="table-responsive">
                                        <table class="table table-striped table-bordered first" id="tab">
                                            <thead>
                                            <tr>
                                                    <th>ID</th>
                                                    <th>虚拟机</th>
                                                    <th>用户名</th>
                                                    <th>操作系统</th>
                                                    <th>内网地址</th>
                                                    <th>端口</th>
                                                    <th>网关地址</th>
                                                    <th>映射端口</th>
                                                    <th>所在域</th>
                                                    <th>申请时间</th>
                                                    <th>状态</th>
                                            </tr>
                                            </thead>
                                            <form id="vmform" method="post">
                                                    {% for records in portList %}
                                                        <tr href="" id="dbtn">
                                                            <td>{{ forloop.counter}}</td>
                                                            <td>{{ records.vm.name }}</td>
                                                            <td>{{ records.vm.os.default_user }}</td>
                                                            <td>{{ records.vm.os_version }}</td>
                                                            <td>{{ records.vm.ip}}</td>
                                                            <td>{{ records.vmPort }}</td>
                                                            <td>{{ records.vm.gateway_ip}}</td>
                                                            <td>{{ records.mapPort }}</td>
                                                            <td>{{ records.vm.region.domain }}</td>
                                                            <td>{{ records.apply_time }}</td>
                                                             {% if records.state == 0 %}
                                                                <td>待审核</td>
                                                            {% elif records.state == 1%}
                                                                <td>已同意</td>
                                                             {% elif records.state == 2%}
                                                                <td>已拒绝</td>
                                                               {% elif records.state == 3%}
                                                                 <td>已删除</td>
                                                            {% endif %}
                                                        </tr>
                                                    {% endfor %}
                                                </form>
                                        </table>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>

    </div>






{% endblock %}



